<template>
  <div class="App" id="APP">
    <NConfigProvider :locale="zhCN" :theme="store.darkTheme ? dark : undefined" :date-locale="dateZhCN"
      :theme-overrides="themeOverrides" :inline-theme-disabled="false" class="provider">
      <n-global-style />
      <NMessageProvider>
        <n-loading-bar-provider>
          <MessageApi />
        </n-loading-bar-provider>
      </NMessageProvider>
      <div class="provider">
        <router-view></router-view>
      </div>
    </NConfigProvider>
  </div>
</template>
<script setup>
import { zhCN, dateZhCN, darkTheme, NConfigProvider, NMessageProvider } from "naive-ui";
import MessageApi from "@/components/message-api.vue";

import Store from "@/stores";
const store = Store();
const dark = darkTheme
// import { useRoute, useRouter } from "vue-router";
// const Route = useRoute();
// const Router = useRouter();
const themeOverrides = {
  common: {
    primaryColor: "#4086ff",//方法一：总体设置
    primaryColorHover: "#4086ff",
  },
}

  ;
</script>
<style lang="less" scoped>
.App {
  width: 100vw;
  min-width: 1200px;
  height: 100vh;
  font-size: 14px;
  // font-family: v-sans, v-mono, other-fallbacks;
}

.provider {
  height: 100%;
}
</style>
<style lang="less">
.n-drawer {
  height: 100vh;
}

// 进入后和离开前保持原位
.fade-right-enter-to,
.fade-right-leave-from {
  opacity: 1;
  transform: none;
}

// 设置进入和离开过程中的动画时长
.fade-right-enter-active,
.fade-right-leave-active {
  transition: all 0.2s ease;
}

// 进入前和离开后为透明，并在右侧20px位置
.fade-right-enter-from,
.fade-right-leave-to {
  opacity: 0;
  transform: translateX(20px);
}
</style>
<style>
.v-binder-follower-container {
  /* height: 100vh; */
  z-index: 9999 !important;
}
</style>
